<template>
  <epgis-nav-container title="注册">
    <template #container>
      
      <div style= "height: 100%; width: 100%;background: white;" class="layoutVerticle">
        <div class="layoutHorizontal layoutCenter" style="margin-top: 80px;">
          <img src="@/assets/icon/register/password.png"/>
        </div>
        <div class="layoutVerticle layoutCenter">
          <span style=" font-size: 16px; font-weight: bold; margin-top: 20px;">请填写你的登陆密码</span>
          <span style="font-size: 14px; margin-top: 10px;">数据加密处理，保障信息安全</span>
        </div>

        <div class="layoutVerticle layoutCenter inputBorder" style=" margin-left: 20%;  margin-right: 20%; margin-top: 40px;font-size: 18px;">
          <van-field v-model="password" label="" type="textarea" rows="1" autosize="" placeholder="请输入登陆密码">
          </van-field>
        </div>

        <div class="layoutVerticle layoutCenter inputBorder" style=" margin-left: 20%;  margin-right: 20%; margin-top: 10px;font-size: 18px;">
          <van-field v-model="confirmPw" label="" type="textarea" rows="1" autosize="" placeholder="请输入确认密码">
          </van-field>
        </div>

        <!-- <div @click="nextStep"  class="layoutVerticle layoutCenter " style="position: absolute;bottom: 68px; left: 0; right: 0; margin: 0 auto;">
          <img src="@/assets/icon/register/next.png"/>
        </div> -->

        <van-button @click="nextStep" type="primary" style="position: absolute;bottom: 68px; left: 12%; right: 12%; margin: 0 auto;border-radius: 8px;" >
          注 册
        </van-button>
        


      </div>
    </template>
  </epgis-nav-container>
</template>

<script>
import { Http, Uploader } from "@/common/HttpClient";
import { MapUtil } from "@/common/mapUtil";
import { NativeUtil } from "@/common/utils";
import * as turf from "@turf/turf";
import { Toast, Notify } from "vant";
export default {
  components: {},
  data() {
    return {
      password:'',
      confirmPw:'',
      registMsg:{},
    };
  },

  mounted() {

  },
  destroyed() {
  },
  activated() {
    this.registMsg = sessionStorage.getItem("registMsg");
    if(this.registMsg){
      this.registMsg = JSON.parse(this.registMsg);
    }

  },
  methods: {

    nextStep() {
      if(this.checkValue()){
        this.registMsg['password'] = this.password;
        sessionStorage.setItem("password", JSON.stringify(this.password));
        this.submitRegist();
      }
    },

    checkValue(){
      if (!this.password) {
        Notify({
            type: "danger",
            message: "请输入登陆密码",
        });
        return false;
      } 
      if (!this.confirmPw) {
        Notify({
            type: "danger",
            message: "请输入确认密码",
        });
        return false;
      } 

      if(this.password != this.confirmPw){
        Notify({
            type: "danger",
            message: "登陆密码与确认密码不一致，请确认",
        });
        return false;
      }
      return true;
    },

    submitRegist(){
      var inviter = sessionStorage.getItem("inviter");
      if(inviter == null || inviter == undefined){
        inviter = null;
      }

      let that = this
      Http.instance()
        .postJSON({
          url: "/makeFriends/app/register",
          params: {
            mobile: this.registMsg["phone"],
            birthday: this.registMsg["birthday"] + " 00:00:00",
            sex: this.registMsg["sex"],
            liveCity: this.registMsg["cityCode"],
            password: this.registMsg["password"],
            inviter,
          },
        })
        .then((ret) => {
          console.log("注册返回：" + JSON.stringify(ret));
          Notify({
              message: '注册成功',
              type: "success",
          });
          sessionStorage.removeItem("operationType");
          sessionStorage.removeItem("inviter");
          history.go(-5);
        }).catch((result) =>{
          Notify({
            type: "danger",
            message: "" + result,
          });
        });
    },









    




  },
};
</script>

<style lang="less" scoped>

  .layoutVerticle{
    display: flex;
    flex-direction: column;
  }

  .layoutHorizontal{
    display: flex;
    flex-direction: row;
  }

  .layoutCenter{
    justify-content: center;
    align-items: center;
  }
  .inputBorder{
    position: relative;
    padding: 8px 0px;
    &::after{
      position: absolute;
      box-sizing: border-box;
      content: '';
      pointer-events: none;
      bottom: 0%;
      border-bottom: 1px solid #ebedf0;
      width: 100%;
    }
    /deep/.van-field__control{
      font-size: 16px;
    }
  }

  /deep/.van-cell {
    padding: 0px 0px;
  }

  /deep/.van-field__control {
    text-align: center;
  }







</style>